<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // //函数参数指定默认值
        // function fn (x, y) {
        //     //短路操作，判断y是否存在，存在取y的值，不存在取后面的值
        //     y = y || 1
        //     console.log('合计:' + x + y)
        // }
        // fn (1)
            
            //直接给形参赋值
            // function fn (x, y = 1) {
            //     console.log('合计:' + x + y)
            // }
            // fn(1)

                //先解构再赋值
            // function fn ({x, y = 1}) {
            //     console.log('合计:' + x + y)
            // }
            // fn({x: 1})

            /* 
            创建一个x，和y的变量并传递进两个默认的值0，0；如果没有传参
            就会赋值一个空对象，并将空对象进行解构，解构出两个变量
            */
            // function m1({x = 0, y = 0} = {}) {
                
            //     return [x, y];
            // }

            /* 
            将对象{x: 0, y:0}，给到{x, y}，并对{x, y}进行解构
            */
            // function m2({x, y} = {x: 0, y:0}){
            //     return [x, y];
            // }
            // console.log(m1()) //输出结果[0, 0]
            // console.log(m2()) //输出结果[0, 0]
            // console.log(m1({x: 3})) // [3, 0]

            /* 流程将{x: 3}传入对象{x: 0, y:0}时，只对x进行赋值，y并没有被赋值
            所以输出结果时y为undefined
            */
            // console.log(m2({x: 3}))// [3, undefined]

            // 写法'...y'是函数的rest参数，可以获取剩余参数的值并放入数组中
            // function fn (x, ...y) {
            //     console.log(x)
            //     console.log(y)
            // }
            // fn(1, 2, 3, 4)

            function fn ({x, ...y}) {
                console.log(x)
                console.log(y)

            }
            fn({
                x: 1,
                a: 1, 
                b: 2
            })

            /* 输出是 1 
                {a:1, b:2}
                rest拿到的是未被定义的对象的集合
            */ 


    </script>
</body>
</html>